<template>
	<div id="WriteLogistics">
		<x-header :left-options="{showBack: false}" title="订单详情" class="header">
			<a slot="left" @click="back()"><i class="tp-icon icon-black-back"></i></a>
		</x-header>
		<div class="shopInfo">
			<div class="sellInfo">
				<img v-if="goodsOrder.member_id == undefined" src="../assets/images/home/defaultImg.jpg" class="photo" alt="" />
				<img v-else :src="'/los/uploads/thumb/header/' + goodsOrder.member_id + '_80X80.jpeg'" class="photo" alt="" />
				<span class="shop_name">{{goodsOrder.member_nickname}}</span>
				<img src="../assets/images/home/icon_right.png" class="right" alt="" />
				<div class="contact">
					<a :href="'tel:' + goodsOrder.receiver_tel">
						<i class="pm-icon icon-tel"></i>
						<span>联系买家</span>
					</a>
				</div>
			</div>
		</div>
		<div class="buyInfo">
			<div class="pic_bar" v-if="goodsOrder.order_from == 'auction_signup' || goodsOrder.order_from == 'auction_order'">
				<router-link :to="'/Detail/id/' + auctionOrder.auction_id">
					<img :src="'/los' + auctionOrder.goods.goods_thumb" alt="" />
					<div class="right">
						<p>{{auctionOrder.goods.goods_name}}</p>
						<p class="price"><span>￥{{goodsOrder.pay_money}}</span>（成交价）</p>
						<div class="content">发货期限：{{common.timestampToTime(goodsOrder.order_time + 86400 * 3)}}</div>
					</div>
				</router-link>
			</div>

			<div class="pic_bar" v-if="goodsOrder.order_from == 'seckill_order'">
				<router-link :to="'/ZoneDetail/id/' + auctionOrder.seckill_id">
					<img :src="'/los' + auctionOrder.goods.goods_thumb" alt="" />
					<div class="right">
						<p>{{auctionOrder.goods.goods_name}}</p>
						<p class="price"><span>￥{{goodsOrder.pay_money}}</span>（成交价）</p>
						<div class="content"></div>
					</div>
				</router-link>
			</div>
		</div>
		<div class="street" v-if="goodsOrder.order_from != 'auction_signup' && auctionOrder.pay_state != 0">
			<div class="way">
				<span>收&nbsp;货&nbsp;&nbsp;人 : &nbsp;{{goodsOrder.receiver_name}}</span>
				<b>{{goodsOrder.receiver_tel}}</b>
			</div>
			<div class="block">
				<img src="../assets/images/home/icon_address.png" alt="" />
				<span>收货地址 :</span>
				<p>{{goodsOrder.receiver_province}}{{goodsOrder.receiver_city}}{{goodsOrder.receiver_county}}{{goodsOrder.receiver_address}}
				</p>
			</div>
		</div>
		<div class="cert-content">
			<ul>
				<li>
					<x-input title="物流公司" v-model="express_comanay" type="text" placeholder="请输入物流公司" :show-clear="false" required/>
				</li>
				<li>
					<x-input title="运单号" v-model="express_number" type="text" placeholder="请输入运单号" :show-clear="false" required/>
				</li>
			</ul>
			<div class="qrcode" @click="scanWXQRcode">
				<img src="../assets/images/home/icon_camara_qrcode.png" alt="" />
			</div>
		</div>
		<button @click="deliverInfo(goodsOrder.order_from)">确认发货</button>
		<toast v-model="success" type="text" width='4rem' is-show-mask>{{msg}}</toast>
	</div>
</template>

<script>
	import $ from 'jquery'
	import { XHeader, XInput, Toast } from 'vux'
	import wx from 'weixin-js-sdk';
	export default {
		data() {
			return {
				goodsOrder: '',
				auctionOrder: '',
				order_from: '',
				order_sn: '',
				express_comanay: '',
				express_number: '',
				success: false,
				msg: '',
				urls: ''
			}
		},
		components: {
			XHeader,
			XInput,
			Toast
		},
		mounted() {
			this.getOrderInfo();
		},
		methods: {
			getOrderInfo: function() {
				this.order_sn = this.$route.params.order_sn;
				this.$http({
					method: 'GET',
					url: '/los/api/member/goods_order_info.json?order_sn=' + this.order_sn,
					data: ''
				}).then((result) => {
					this.goodsOrder = result.data.goods_order;
					if(result.data.auction_order) {
						this.auctionOrder = result.data.auction_order;
					} else if(result.data.seckill_order) {
						this.auctionOrder = result.data.seckill_order;
					} else if(result.data.auction_signup) {
						this.auctionOrder = result.data.auction_signup;
					}

				}).catch((err) => {

				})
			},

			//微信扫一扫
			scanWXQRcode: function() {
				let _this = this;
				let urls = window.location.href.split('#')[0];
				var params = {
					url: urls,
				}
				this.$http({
					method: 'POST',
					url: '/los/api/oauth/script',
					data: params,
				}).then((result) => {
					if(result) {
						wx.config({
							debug: result.data.debug,
							appId: result.data.appId,
							timestamp: result.data.timestamp,
							nonceStr: result.data.nonceStr,
							signature: result.data.signature,
							jsApiList: result.data.jsApiList,
						});
						wx.ready(function() {
							wx.scanQRCode({
								needResult: 1,
								scanType: ["qrCode", "barCode"],
								success: function(res) {
									_this.express_number = res.resultStr;
									_this.getCompanyDelivery(_this.express_number);
								}
							});
							wx.error(function(res) {
								alert(JSON.stringify(res));
							});
						})
					} else {
						alert('获取信息失败 请重新尝试');
					}
				}).catch((err) => {
					console.log(err);
				})
			},
			getCompanyDelivery: function(express_number) {
				this.$http({
					method: 'GET',
					url: '/api/express/qurey_company.json?delivery_code=' + express_number,
				}).then((result) => {
					if(result.data.code == 1) {
						this.express_info = result.data.data.express_info.slice(0, 1);
						var comName;
						$.each(this.express_info, function(index, value) {
							comName = value.comName;
						})
						this.express_comanay = comName;
					}
				}).catch((err) => {

				})
			},

			//发送快递单号
			deliverInfo: function(order_from) {
				console.log(order_from);
				if(order_from == 'seckill_order') {
					this.urls = '/los/api/seller/express.json';
				} else if(order_from == 'auction_order' || order_from == 'auction_signup') {
					this.urls = '/los/api/auction/express.json';
				}
				var params = {
					express_comanay: this.express_comanay,
					express_number: this.express_number,
					order_sn: this.order_sn
				}
				console.log(params);
				if(this.express_comanay == '') {
					this.success = !this.success;
					this.msg = '请输入快递公司';
				} else if(this.express_number == '') {
					this.success = !this.success;
					this.msg = '请输入快递编号';
				} else {
					this.$http({
						method: 'POST',
						url: this.urls,
						data: params
					}).then((result) => {
						this.success = !this.success;
						this.msg = result.data.msg;
						if(result.data.code == 1) {
							setTimeout(() => {
								window.history.go(-1);
							}, 500)
						}
					}).catch((err) => {
						console.log(err);
					})
				}
			},
			back: function() {
				window.history.go(-1);
			}
		}
	}
</script>

<style scoped="scoped">
	.header {
		background: #fff;
	}
	
	.shopInfo {
		background: #fff;
		margin-top: 0.26rem;
	}
	
	.shopInfo .sellInfo {
		height: 1.17rem;
		line-height: 1.17rem;
	}
	
	.shopInfo .sellInfo .photo {
		width: 0.74rem;
		height: 0.74rem;
		margin: 0.21rem 0.26rem;
		float: left;
		border-radius: 0.05rem;
	}
	
	.shopInfo .sellInfo .shop_name {
		height: 1.17rem;
		line-height: 1.17rem;
		display: inline-block;
		font-size: 0.34rem;
		float: left;
	}
	
	.shopInfo .sellInfo .right {
		width: 0.26rem;
		height: 0.26rem;
		line-height: 1.17rem;
		margin: 0.4rem;
		float: left;
	}
	
	.sellInfo .contact {
		width: 2.21rem;
		height: 0.61rem;
		line-height: 0.61rem;
		float: right;
		border-radius: 0.3rem;
		background: #f0f0f0;
		margin: 0.21rem 0.26rem;
		overflow: hidden;
	}
	
	.sellInfo .contact {
		width: 2.21rem;
		height: 0.61rem;
		display: block;
		overflow: hidden;
	}
	
	.sellInfo .contact .icon-tel {
		float: left;
		margin: 0.13rem 0 0.13rem 0.2rem;
	}
	
	.sellInfo .contact span {
		float: right;
		color: #777;
		font-size: 0.32rem;
		margin-right: 0.26rem;
		margin-top: 0.04rem;
	}
	
	.buyInfo {
		padding: 0.26rem;
		position: relative;
		background: #fff;
	}
	
	.buyInfo:before {
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		height: 1px;
		border-top: 1px solid #e6e6e6;
		color: #e6e6e6;
		transform-origin: 0 0;
		transform: scaleY(0.5);
	}
	
	.buyInfo .pic_bar {
		padding: .4rem 0;
		width: 100%;
		height: 2.8rem;
	}
	
	.buyInfo .pic_bar img {
		width: 2.05rem;
		height: 2.05rem;
		float: left;
		border-radius: .05rem;
	}
	
	.buyInfo .pic_bar .right {
		float: left;
		margin-top: .05rem;
		margin-left: .34rem;
		height: 2rem;
		width: 6.93rem;
		position: relative;
	}
	
	.buyInfo .pic_bar .right p {
		font-size: 0.37rem;
		line-height: 0.5rem;
		color: #333;
		overflow: hidden;
		text-align: left;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	.buyInfo .pic_bar .right b {
		font-weight: normal;
		color: #DA4240;
		font-size: 0.42rem;
		display: block;
		float: left;
	}
	
	.buyInfo .pic_bar .right .price {
		line-height: 0.56rem;
		margin-top: 0.2rem;
		font-size: 0.32rem;
		color: #aaa;
	}
	
	.buyInfo .pic_bar .right span {
		color: #dd2828;
		font-size: 0.42rem;
	}
	
	.buyInfo .pic_bar .right .content {
		color: #aaa;
		font-size: 0.32rem;
		overflow: hidden;
		text-align: left;
		margin-top: 0.22rem;
	}
	
	.buyInfo .pic_bar .numWrap {
		float: left;
		width: 80%;
		margin-top: 0.37rem;
	}
	
	.street {
		width: 100%;
		margin-top: 0.26rem;
		background: #fff;
		padding: 0.26rem;
		height: 2.66rem;
	}
	
	.street .way {
		overflow: hidden;
		color: #333;
		font-size: 0.37rem;
		margin-top: 0.2rem;
	}
	
	.street .way span {
		float: left;
		display: inline-block;
		margin-left: 0.53rem;
	}
	
	.street .way b {
		float: right;
		font-weight: normal;
	}
	
	.street .block {
		overflow: hidden;
		margin-top: 0.25rem;
	}
	
	.street .block img {
		float: left;
		width: 0.4rem;
		margin-right: 0.14rem;
		margin-top: 0.05rem;
		border-radius: 0.05rem;
	}
	
	.street .block span {
		font-size: 0.37rem;
		float: left;
		line-height: 0.5rem;
	}
	
	.street .block p {
		float: right;
		width: 72%;
		height: 1rem;
		line-height: 0.5rem;
		overflow: hidden;
		font-size: 0.37rem;
	}
	
	.cert-content {
		background: #fff;
		width: 100%;
		position: relative;
		margin-top: 0.26rem;
		height: 100%;
	}
	
	.cert-content:before {
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		height: 1px;
		border-top: 1px solid #e6e6e6;
		color: #e6e6e6;
		transform-origin: 0 0;
		transform: scaleY(0.5);
	}
	
	.cert-content ul {
		width: 100%;
		padding: 0 0.26rem;
	}
	
	.cert-content>ul li {
		width: 100%;
		height: 1.3rem;
		line-height: 1.3rem;
		position: relative;
		padding-top: 0.1rem;
	}
	
	.cert-content>ul li:after {
		content: " ";
		position: absolute;
		left: 0;
		top: 1.3rem;
		right: 0;
		height: 1px;
		border-bottom: 1px solid #e6e6e6;
		color: #e6e6e6;
		transform-origin: 0 0;
		transform: scaleY(0.5);
	}
	
	.cert-content>ul li .weui-cell {
		padding: 0!important;
	}
	
	button {
		width: 9.46rem;
		height: 1.3rem;
		background: #a30000;
		border: none;
		color: #fff;
		margin: 1.04rem 0.26rem;
		font-size: 0.4rem;
	}
	
	.qrcode {
		width: 0.64rem;
		height: 0.53rem;
		position: absolute;
		right: 0.26rem;
		top: 1.69rem;
	}
	
	.qrcode img {
		width: 100%;
		height: 100%;
	}
</style>